AutoComplete — класс для автозаполнения строки ввода. К примеру вы захотели сделать на своем сайте функцию помогающую заполнять поле город. При вводе начальных символов всплывает подсказка со списком городов имеющих в названиях введенные вами символы. Для использования класса AutoComplete в Yii 2.0 нам необходимо его подключить к своему шаблону. Как правило подключения классов в yii 2.0 осуществляется верхней части шаблона
Для использования jui подключите его к фреймворку
1 | "yiisoft/yii2-jui": "^2.0" |
Вставьте в composer.json file и потом update composer( используйте код
1 | php composer.phar update |
)
1 2 3 | <?use yii\jui\AutoComplete;// Указываете путь до библиотеки?> |
Так же надо будет указать путь до модели откуда будут браться данные. В моем случае эта модель Goroda
1 2 3 | <?use app\models\Goroda;?> |
После подключения модели нужно сформировать список и передать виджету AutoComplete
1 2 3 4 5 6 7 8 | <?//формируем список$listdata=Goroda::find()->select(['id as value', 'name as label'])->asArray()->all();?><?//Передаем список виджету AutoComplete?><?= $form->field($model,'otkuda')->widget(AutoComplete::className(), ['clientOptions'=> ['source'=> $listdata,],'options'=>['class'=>'form-control' ]]);?> |
Рассмотрим еще один пример в котором у Вас есть таблица с именем family и она содержит идентификатор и имя файлов. В форме, которую вы хотите, чтобы имена разных семейств были автоматически заполнены.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <?phpuse yii\jui\AutoComplete;use yii\web\JsExpression;$data = Family::find() ->select(['name as value', 'name as label','id as id']) ->asArray() ->all(); echo 'Family Name' .'<br>'; echo AutoComplete::widget([ 'clientOptions' => [ 'source' => $data, 'minLength'=>'3', 'autoFill'=>true, 'select' => new JsExpression("function( event, ui ) { $('#memberssearch-family_name_id').val(ui.item.id);//#memberssearch-family_name_id is the id of hiddenInput. }")], ]); ?> |